<template>
  <div class="main-box-right">
          <div class="main-box-right-nav">
            <router-link :to="value.link" active-class="active" v-for="(value,i) in allpath" :key="i">{{value.nav}}</router-link>
          </div>
          <Goods>
        </Goods>
    </div>
</template>

<script>
import CommonForm from '@/components/ly/Common/CommonForm'
import Goods from './Goods.vue'
export default {
    name:"Collect",
    components:{Goods,CommonForm},
    data() {
        return {
           allpath:[],
          //  flag:false
        }
    },
    methods:{
    },
    mounted(){
            // 同一组件复用
          const path = this.$route.path
          // 我的足迹
          if(path === '/personal/myfootmark'){
                this.allpath= [{
                        nav:'我的足迹',
                        link:{
                          name:'myfootmark',
                        }
                    }]
          }
          // 我的收藏
          else if(path === '/personal/mycollect'){
              this.allpath= [{
                        nav:'收藏商家',
                        link:{
                          name:'mycollect',
                        }
                    }]
          }
          // 我的优惠券
          else if(path === '/personal/mycoupon'){
              this.allpath= [{
                        nav:'我的优惠券',
                        link:{
                          name:'mycoupon',
                        }
                    }]
          }
          // 我的预约
          else{
              this.allpath= [
                      {
                        nav:'全部预约',
                        link:{
                          name:'AllOrder',
                        }
                      },
                      {
                        nav:'已完成',
                        link:{
                          name:'OverOrder',
                        }
                      },
                      {
                        nav:'未进行',
                        link:{
                          name:'Ordering',
                        }
                      },
                      {
                        nav:'待评价',
                        link:{
                          name:'AssessOrder',
                        }
                      },
                    ]
          }
    }
    
}
</script>

<style lang="less" scoped>
@navcolor: rgb(58, 58, 58);
@navfont: 13px;
@width: 1200px;
@hovercolor: #76d4ff;
* {
  margin: 0;
  padding: 0;
}
a {
  text-decoration: none;
}
input {
  outline: none;
}
li {
  list-style: none;
}
.main-box-right {
      margin-left: 20px;
      float: left;
      width: 900px;
      border-radius: 4px;
      background-color: #ffffff;
      border: 1px solid #e5e5e5;
      margin-bottom: 10px;
      position: relative;
      .main-box-right-nav{
        width: 100%;
        height: 80px;
        // background: #76d4ff;
        display: flex;
        a{
          text-align:center ;
          line-height: 80px;
          flex-grow: .1;
          justify-content:space-between;
          cursor: pointer;
          color: black;
        }
        .active{
            border-bottom: 2px solid #76d4ff;
          }
      }

}
</style>